<!--
 * @Author: 李天惊 uf_lee@163.com
 * @Date: 2022-08-15 16:45:26
 * @LastEditors: 李小晴 2689279066@qq.com
 * @LastEditTime: 2023-02-16 10:15:31
 * @FilePath: \grazlink20\uc_sys\src\views\Asset\VaccineInject\components\See.vue
 * Copyright (c) 2022 by 李天惊 uf_lee@163.com, All Rights Reserved. 
-->
<script setup lang="ts">
import { ref, reactive, PropType } from 'vue'
import { ElButton } from 'element-plus'

import { ContentWrap } from '@/components/ContentWrap'
import { Descriptions } from '@/components/Descriptions'
import { UploadMultiple } from '@/components/UploadMultiple'
import { Dialog } from '@/components/Dialog'
import { Table } from '@/components/Table'

// import { adminFaVaccineInjectOrderSeeApi } from '@/api/fa/vaccineInject'
// 获取字典
// import { useIcon } from '@/hooks/web/useIcon'
import { useCache } from '@/hooks/web/useCache'
// import { zcLoanOrderDetailedListApi } from '@/api/cy/Loanapply'
import { useCrudSchemas } from '@/hooks/web/useCrudSchemas'
import { useTable } from '@/hooks/web/useTableTest'
import { zcVaccineDetailedListApi, zcVaccineDrugDetailedListApi } from '@/api/cy/VaccineInject'

const { wsCache } = useCache()

/****************************** 变量 start ******************************/
const dict: any = wsCache.get('dict')
// const iconFile = useIcon({ icon: 'ic:outline-file-present' })
// const actionType = ref('')
const dialogVisible = ref(false)
const dialogTitle = ref('')
// const d_row = ref<any>({})
const dFile = ref([])
const searchRef = ref() // 搜索的标签

const d_columns = reactive<TableColumn[]>([
  {
    field: 'index',
    label: '序号',
    type: 'index',
    width: 30
  },
  {
    field: 'asset_code',
    label: '注射编码',
    width: 150,
    search: {
      show: true
    }
  },
  {
    field: 'asset_code_2',
    label: '项圈编码',
    width: 150,
    search: {
      show: true
    }
  },
  {
    field: 'earcon_code',
    label: '耳标号',
    width: 150
  },
  {
    field: 'breed',
    label: '畜别',
    width: 100,
    formatter: (_: Recordable, __: TableColumn, cellValue: number | string) => {
      return getDictLabel('breed', cellValue)
    }
  },
  {
    field: 'breed_sub',
    label: '品种',
    width: 150,
    formatter: (_: Recordable, __: TableColumn, cellValue: number | string) => {
      return getDictLabel('breed_sub', cellValue)
    }
  },
  {
    field: 'purpose',
    label: '用途',
    width: 150,
    formatter: (_: Recordable, __: TableColumn, cellValue: number | string) => {
      return getDictLabel('purpose', cellValue)
    }
  },
  {
    field: 'sex',
    label: '性别',
    width: 150,
    formatter: (_: Recordable, __: TableColumn, cellValue: number | string) => {
      return getDictLabel('animal_sex', cellValue)
    }
  }
])
/****************************** 变量 end ******************************/
const { allSchemas } = useCrudSchemas(d_columns)

/****************************** 组件参数 start ******************************/
// 获取参数
const props = defineProps({
  id: {
    type: String,
    default: null
  },
  currentRow: {
    type: Object as PropType<Nullable<any>>,
    default: () => null
  },
  detailSchema: {
    type: Array as PropType<DescriptionsSchema[]>,
    default: () => []
  }
})
/****************************** 组件参数 end ******************************/

/****************************** 函数方法 start ******************************/
// 字典通过value获取label
const getDictLabel = (type, value) => {
  let data = dict[type].find((item) => {
    return item.value == value
  })
  return data ? data.label : ''
}

const y_columns = reactive<TableColumn[]>([
  {
    field: 'index',
    label: '序号',
    type: 'index',
    width: 30
  },
  // {
  //   field: 'd_id',
  //   label: 'd_id',
  //   width: 150
  // },
  {
    field: 'drug_name',
    label: '药品名称(内部)',
    width: 170
  },
  {
    field: 'medication_name',
    label: '药品名称(外采)',
    width: 150
  },
  {
    field: 'type',
    label: '类型',
    formatter: (_: Recordable, __: TableColumn, cellValue: number | string) => {
      return getDictLabel('medical_drug_type', cellValue)
    },
    width: 180
  },
  {
    field: 'amount',
    label: '金额',
    width: 180
  },
  {
    field: 'medication_number',
    label: '数量',
    width: 180
  },
  {
    field: 'note',
    label: '备注',
    width: 150
  }
])
// 调用查看接口获取信息

const { register, tableObject, methods } = useTable<
  {
    total: number
    list: any[]
  },
  any
>({
  getListApi: zcVaccineDetailedListApi,
  response: {
    data: 'data',
    count: 'count'
    // can: { select_type: '5', pasture_org_id: props.currentRow.id }
  }
})
const { getList, setSearchParams } = methods

/****************************** 函数方法 end ******************************/
const newFixedSearch = ref({})
const DrugdetailedData = ref()
/****************************** 初始化 start ******************************/
const init = async () => {
  // 调用查看接口查询数据
  newFixedSearch.value = {
    vaccine_order_id: props.id
  }
  tableObject.fixedSearch = newFixedSearch.value
  getList()
  const Yao = await zcVaccineDrugDetailedListApi({ vaccine_order_id: props.id })
  if (Yao) {
    DrugdetailedData.value = await Yao.data
  }
}
init()
/****************************** 初始化 end ******************************/
</script>

<template>
  <div>
    <ContentWrap title="主数据">
      <Descriptions :schema="props.detailSchema" :data="props.currentRow || {}">
        <template #breed="{ row }: { row: any }">
          <div>{{ getDictLabel('breed', row.breed) }}</div>
        </template>
        <template #breed_sub="{ row }: { row: any }">
          <div>{{ getDictLabel('breed_sub', row.breed_sub) }}</div>
        </template>
        <template #state="{ row }: { row: any }">
          <div>{{ getDictLabel('vaccine_inject_order_detailed_state', row.state) }}</div>
        </template>
      </Descriptions>
    </ContentWrap>
    <!-- <ContentWrap title="附件">
      <UploadMultiple
        ref="fileRef"
        v-model="data.fileData"
        :response="{
          url: 'file_url',
          name: 'file_name',
          file_type: 'file_type'
        }"
        disabled
      />
    </ContentWrap> -->

    <ContentWrap title="明细数据">
      <Search
        ref="searchRef"
        :schema="allSchemas.searchSchema"
        @search="setSearchParams"
        @reset="setSearchParams"
      />
      <div class="mb-10px"> </div>
      <Table
        v-model:pageSize="tableObject.pageSize"
        v-model:currentPage="tableObject.currentPage"
        :columns="allSchemas.tableColumns"
        :data="tableObject.tableList"
        :loading="tableObject.loading"
        :border="true"
        :pagination="{
          total: tableObject.count
        }"
        @register="register"
        :selection="false"
      />
    </ContentWrap>

    <ContentWrap title="药品明细数据">
      <Table :columns="y_columns" :data="DrugdetailedData" :selection="false" :border="true" />
    </ContentWrap>

    <Dialog v-model="dialogVisible" :title="dialogTitle">
      <div>
        <UploadMultiple
          ref="dFileRef"
          v-model="dFile"
          :response="{
            url: 'file_url',
            name: 'file_name',
            file_type: 'file_type'
          }"
          disabled
        />
      </div>

      <template #footer>
        <ElButton @click="dialogVisible = false">关闭</ElButton>
      </template>
    </Dialog>
  </div>
</template>
